<template>
  <div class="hello">
    <Button type="primary" icon="ios-search">搜索</Button>
    <Button type="primary" icon="plus-round">新增</Button>
    <Button type="primary" icon="edit">修改</Button>
    <Button type="error" icon="ios-trash">删除</Button>
    <Button type="ghost" icon="ios-barcode">条码打印</Button>
    <Button type="warning" icon="ios-undo">撤回委托单</Button>
    <Button type="info" icon="ios-redo" @click="showModel">分配委托单</Button>
    <deleteModel :details="details" ref="modalDelete">
    </deleteModel>
  </div>
</template>
<script>
import deleteModel from '../components/deleteModle.vue'
export default {
  name: 'hello',
  data () {
    return {
      details:{
        modalDelete:false,
        delete_loading:false,
        del:{},
      },
    }
  },
  components: {
    deleteModel,
  },
  methods:{

    showModel(){
      let _this = this;
      _this.details.modalDelete=true;
      _this.details.del ={
        del(){
            _this.details.delete_loading = true;
            setTimeout(() => {
              _this.details.delete_loading = false;
              _this.details.modalDelete = false;
              _this.$Message.success('删除成功');
            }, 100);
        },
      }
    },
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
h1, h2 {
  font-weight: normal;
}

ul {
  list-style-type: none;
  padding: 0;
}

li {
  display: inline-block;
  margin: 0 10px;
}

a {
  color: #42b983;
}
</style>
